<template>
   <div id="mainsheet">
                <h3 id="sheetli"><slot name="title"><span>歌曲列表</span></slot></h3>
                <div id="sheetline"></div>
                <span id="songname">歌曲</span>
                <span id="songer">歌手</span>
                <span id="songbox">专辑</span>
                <span id="songtime">选项</span>
                <div id="sheetback"></div>
                <div id="sheetliback">
                   <slot name="song"><song></song></slot>
                </div>
    </div>
</template>

<script>
import song from '../song.vue'
export default {
    name:'sheetback',
    components:{
        song,
    },
     props:['sheetid0'],
}
</script>

<style scoped>

#mainsheet {
     position: absolute;
     top: 0px;
     left: 350px;
     width: 800px;
     height: 550px;
 }
 
 #sheetli {
     color: aliceblue;
 }
 
 #sheetline {
     position: relative;
     background-color: #2c2324;
     width: 850px;
     height: 3px;
 }
 
 #songtime,
 #songer,
 #songbox,
 #songname {
     position: relative;
     top: 10px;
     color: #fff;
     opacity: 0.7;
     font-size: 17px;
     height: 50px;
     font-weight: 300;
     box-sizing: border-box;
 }
 
 #songer {
     left: 300px;
 }
 
 #songbox {
     left: 400px;
 }
 
 #songtime {
     left: 580px;
 }
 
 .songico {
     font-family: "iconfont" !important;
     font-size: 20px;
     margin-right: 20px;
     color: aliceblue;
     font-style: normal;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     cursor: default;
 }
 
 #sheetback {
     position: absolute;
     top: 110px;
     width: 850px;
     height: 450px;
     background: linear-gradient(rgba(255, 255, 255) 50%, transparent 50%);
     background-size: 100% 100px;
     opacity: 0.02;
 }
 
 #sheetliback {
     position: absolute;
     top: 110px;
     width: 850px;
     height: 450px;
     cursor: default;
     overflow-y: scroll;
     overflow-x: hidden;
 }
 ::-webkit-scrollbar {
  width: 8px; 
 
}
::-webkit-scrollbar-thumb {
  background-color:#2c2324;
  border-radius: 5px;
  height:30px;
}
</style>